@fontSize:font-size;
@center:text-align;
@color:color;
@left:left;
@top:top;
@right:right;
@bottom:bottom;
@textAlign:text-algin;

section{
    width:100%;
    max-width:640px;
    background:#f9f9f9;
    margin:0 auto;
     
} 
.box1-left{
    // border:1px solid red;
    margin-left:0.09rem;
    margin-top:0.47rem;
    display:inline-block;
    @{color}:#A9AAAD;
    @{fontSize}:0.14rem;
}

.cityTitle{
    @{fontSize}:0.19rem;
    @{color}:#888d94;
    
}
 .box1-left span{
    @{color}:#888d94;
    @{fontSize}:0.16rem;
    margin-left:5px;
 }
 .box1-right{
   
    
     float:right;
     margin-right:0.2rem;
     margin-top:0.47rem;

 }
 .price{
     position:relative;

 }
 .price i{
    @{color}:#F88412;   
    position:absolute;
    @{left}:0%;
    @{top}:22%;
 }
 .price span{
     @{color}:#F88412;
     @{fontSize}:0.30rem;
     margin-left:0.15rem;
 }
 .box1-right p:nth-of-type(2){
    
     position:relative;
 }
 .box1-right p:nth-of-type(2) a{
       position:absolute;
       @{right}:-12%;
       @{top}:3%;
       @{fontSize}:0.14rem;
      @{color}:#888D94; 
 }
 .targetCity{
     width:3.48rem;
     height:1.05rem;
      background:#fff;
     border:1px solid #CAD7DA;
     margin:0 auto;
     position:relative;
     margin-top:0.1rem;
     border-bottom:none; 
     border-top-left-radius: 10px;
     border-top-right-radius: 10px;
     display:flex;
     /*子元素排列方式:平分*/
     justify-content:space-around;
     /*侧轴对齐方式:居中*/
     align-items:center;
     text-align:center;
 }
 .border{
    position: absolute;
    width: 10px;
    height: 10px;
    border: 1px solid #fff;
    z-index: 1;
    background: #fff;
 }
 .left.bottom{ 
    left: -1px;
    bottom: -1px;
    border-radius: 0px 10px 0px 0px;
    
     border-top:1px solid #CAD7DA;
     border-right:1px solid #CAD7DA;

 }
 .right.bottom{ 
    right: -1px;
    bottom: -1px;
    border-radius: 10px 0px 0px 0px;
    
     border-top:1px solid #CAD7DA;
     border-left:1px solid #CAD7DA;

 }
 .travel-time{
    width:3.48rem;
    padding-bottom:0.35rem;
    border:1px solid #CAD7DA;
    margin:0 auto;
    position:relative;
    border-top:1px dashed #CAD7DA;
    border-bottom-left-radius: 10px;
     border-bottom-right-radius: 10px;
     
 }
 .left.top{ 
    left: -1px;
    top: -1px;
    border-radius: 0px 0px 10px 0px; 
     border-right:1px solid #CAD7DA;

 }
 .right.top{ 
    right: -1px;
    top: -1px;
    border-radius:0px 0px 0px 10px; 
     border-left:1px solid #CAD7DA; 
 } 
 .targetCity .flight{
     width:36px;
     height:27px; 
     background:url("../../images/icon/sprites.png")-253px -205px;
     background-size:375px 475px;   
}
 .startCity h3{
    @{fontSize}:0.3rem; 
    @{color}:#888D94;
 }
 .endCity h3{
    @{fontSize}:0.3rem; 
    @{color}:#888D94;
    
 }
 .startCity,.endCity p{
     @{color}:#A9AAAD;
     @{fontSize}:0.14rem;
 }
 .startCity,.endCity .time{
   margin-bottom:0.27rem;
}
p{
    margin:0;
}
/*-----------travel-time-------------*/

  .travel-left{ 
       float:left;
       margin-left:0.29rem;
       margin-top:0.28rem;

  }
  .travel-right{ 
      width:0.9rem;
     float:right;
     
     margin-right:0.5rem;
     margin-top:0.28rem;
     text-align:left;
    
  }
  .flight-time{
       @{color}:#a9aaad;
       @{fontSize}:0.14rem;
  }
  .travel-left,.date-right p:nth-of-type(2){
    @{color}:#676c73;
    @{fontSize}:0.16rem;
  }
  .travel-left p:nth-of-type(2) span{
    @{fontSize}:0.2rem;
    margin-left:3px;
  }
 .travel-right p:nth-of-type(2) span{
    @{fontSize}:0.2rem;
    margin-right:3px;
  }
  .jingjicang{
    @{color}:#676c73;
    @{fontSize}:0.16rem;
  }
  .ticket{
    display:inline-block;
   
    text-decoration:underline;
    @{color}:#676C73;
    @{fontSize}:0.14rem; 
}
  .reelect{
    display:inline-block;
    @{color}:#1AAFD9;
    @{fontSize}:0.16rem; 
}
.reelect:hover{
    @{color}:#1AAFD9;
    @{fontSize}:0.16rem;
}
/*活动背景*/
.active-img1{
    margin:0.12rem auto;
    width:3.48rem;
    height:0;
    padding-bottom:215/696*100%; 
    background:url("../../images/img/quan_03.png")0px 0px no-repeat;
    background-size:100% 100%;
}
.active-img2{
    margin:0.13rem auto;
    width:3.48rem;
    height:0;
    padding-bottom:215/696*100%; 
    background:url("../../images/img/quan_06.png")0px 0px no-repeat;
    
    background-size:100% 100%;
}
.active-img1,.active-img2{
    position:relative;
    @{color}:#fff;
    @{fontSize}:0.14rem;
    letter-spacing:2px;
   
}
 .active-img1 P:nth-of-type(1){
    margin-left:0.16rem;
    margin-top:0.12rem;
 } 
 .active-img1 P:nth-of-type(2){
    margin-left:0.16rem; 
 }
 .active-img2 P:nth-of-type(1){
    margin-left:0.16rem;
    margin-top:0.12rem;
 } 
 .active-img2 P:nth-of-type(2){
    margin-left:0.16rem; 
 }
.position{
    position:absolute;
    width:1.7rem;
    height:0.98rem;
    @{left}:45%;
    @{top}:8%;
    
}
.computers-msg{
    margin-left:0.16rem;
    @{color}:#999999;
    margin-top:5px;
}
.computers-msg input{
    float:left;
}
.minus{
    width:0.26rem;
    height:0.29rem;
    background:#fff;
}
.number{
    width:0.4rem;
    height:0.29rem;
    background:#F3CC83;
}
.plus{
    width:0.26rem;
    height:0.29rem;
    background:#fff;
}
.pink{
    background:#F2B5D8;
}
/*额外费用*/
.extra{
    margin:0.13rem auto;
    width:3.48rem;
}
.extra-bg{ 
     width:100%;
    height:0;
    padding-bottom:94/696*100%;
  
    background:url("../../images/img/bj_03.png")0px 0px no-repeat;
    background-size:100% 100%;
    @{color}:#fff;
  
    position:relative;
}
.extra-bg h5{
    position:absolute;
    left:5%;
    top:18%;
    @{fontSize}:0.14rem;
     
}
/*额外费用*/
.extra-bottom{
    border:1px solid #CAD7DA;
    border-top:none;
 
    width:100%;
}
.extra-box{
   
    display:flex;
    justify-content: space-around;
    align-items:center;
    padding:20px 0;
}
.extra-left p:nth-of-type(1){
    @{color}:#676C73;
    @{fontSize}:0.16rem;
}
.extra-p{
   margin-top:8px;
  
}
.extra-minus{
    width:0.255rem;
    height:0.29rem;
    background:#fff;
    border:1px solid #CCCCCC;
    @{fontSize}:0.12rem;
}
.extra-left p:nth-of-type(1){
    @{fontSize}:0.16rem;
    min-width:1.87rem;
     
}
.extra-number{
    width:0.4rem;
    height:0.29rem;
    border:1px solid #CCCCCC;
    border-left:none;
    border-right:none;
    @{fontSize}:0.1rem;
}
.extra-plus{
    width:0.255rem;
    height:0.29rem;
    background:#fff;
    border:1px solid #CCCCCC;
    @{fontSize}:0.12rem;
}
.extra-right{
    position:relative;
    @{fontSize}:0.14rem;
    @{color}:#888D94;

}
.extra-right i{
    color: #F88412;
    position: absolute;
    left: 0%;
    top: 22%;
}
.extra-right span{
    color: #F88412;
    font-size: 0.30rem;
    margin-left:0.15rem;
}
.extra-bottom .bottom-dashed{
    border-bottom:1px dashed #CAD7DA;
}
 .insurance-p1{
      @{color}:#676C73;
      @{fontSize}:0.16rem;
      margin:0.22rem 0 0.03rem 0.16rem;
     
 }
 .insurance-p2{
    margin:0 0.25rem 0 0.16rem;
    @{fontSize}:0.14rem;
    @{color}:#A9AAAD;
 }
.insurance-p2 i{
    width:13px;
    height:13px;
    display:inline-block; 
    position:relative;
    top:3px;
    background:url("../../images/icon/sprites.png")-219px -210px;
      background-size:375px 475px;  
}
.insurance2-box1{
     margin-top:0.1rem;
    display:flex;
    justify-content: space-around;
    align-items: center;
}
.insurance2-left{
    
}
.insurance2-left input{
    width:0.17rem;
    height:100%; 
    height:0.14rem; 
    float:left;
    appearance: checkbox;
}
.insurance2-left span{
    width:1.63rem;
    @{fontSize}:0.12rem;
    @{color}:#676C73;
    display:inline-block;
}
.insurance2-right{
    position:relative;

}
.insurance2-right i{
    color: #F88412;
    position: absolute;
    left: 0%;
    top: 22%;
}
.insurance2-right span{
    color: #F88412;
    @{fontSize}: 0.30rem;
    margin-left: 0.12rem;
}
.insurance2-box2{
    width:2.71rem;
    margin:0.03rem auto;
     @{color}:#A9AAAD;
     @{fontSize}: 0.10rem;
}
.insurance3{
    width:3.12rem;
    margin:0 auto; 
}
.insurance3 a{ 
    @{color}:#37B4DB;
    @{fontSize}: 0.10rem;
    margin-left:2.572rem;
    display:inline-block;
    text-decoration:underline;
}
footer{
    width:3.5rem;
    height:0.52rem;
    max-width:640px;
    background:#F1A30F;
    margin:0 auto;
}
footer a{
    @{color}:#fff;
    position:absolute;
    display:block;
    margin:0.16rem 0 0 1.15rem;
    @{fontSize}:0.16rem;
}
footer a:hover{
     @{color}:#fff;
     text-decoration:none;
      
}
